<template>
  <div class="base-container" id="main">
    <t-form ref="form" :data="queryParams" label-width="80" @submit="()=>{this.pagination.current=1;this.queryParams.pageNum=1;this.getList()}" @reset="()=>{this.queryParams.pageNum=1;this.queryParams.pageNum=1;this.queryParams.systemId='';this.queryParams.firstDraftUnitName='';this.getList()}">
      <t-row style="border-bottom: 1px solid #E5E6EB;margin-bottom: 10px">
        <t-col :span="11" class="query-form-inline">
          <t-form-item label="标准名称" name="projectName">
            <t-input
              v-model="queryParams.projectName"
              clearable
              placeholder="请输入标准名称"
              style="width: 240px"
            />
          </t-form-item>
          <t-form-item label="标准性质" name="standardProperty">
            <t-select style="width: 240px" clearable  v-model="queryParams.standardProperty"
                      :options="dict.type.standard_property">
            </t-select>
          </t-form-item>
          <t-form-item label="制定或修订" name="formulateType">
            <t-select style="width: 240px" clearable  v-model="queryParams.formulateType"
                      :options="dict.type.formulate_type">
            </t-select>
          </t-form-item>
          <t-form-item label="主管部门" name="manageDeptId">
            <t-tree-select style="width: 300px" clearable filterable :treeProps="{ keys: { value: 'id' } }"
                           v-model="queryParams.manageDeptId" :data="deptMenuOptions" placeholder="选择主管部门"></t-tree-select>
          </t-form-item>
          <t-form-item label="起草单位" name="draftUnitNames">
            <t-input
              v-model="queryParams.draftUnitNames"
              clearable
              placeholder="请输入起草单位"
              style="width: 240px"
            />
          </t-form-item>
          <t-form-item label="计划完成时间" name="publicDateRange">
            <t-date-range-picker style="width: 280px" :placeholder="['开始时间','结束时间']" v-model="queryParams.publicDateRange"  allow-input clearable/>
          </t-form-item>
          <t-form-item label="有项目支撑" name="projectUp">
            <t-select style="width: 240px" clearable :options="dict.type.yes_or_not" v-model="queryParams.projectUp"></t-select>
          </t-form-item>
          <t-form-item label="有涉及专利" name="patentUp">
            <t-select style="width: 240px" clearable :options="dict.type.yes_or_not" v-model="queryParams.patentUp"></t-select>
          </t-form-item>
          <t-form-item label="标准类别" name="standardCategory">
            <t-select style="width: 240px" clearable  v-model="queryParams.standardCategory" :options="dict.type.standard_category">
            </t-select>
          </t-form-item>
          <t-form-item label="标准状态" name="standardStatus">
            <t-select style="width: 240px" clearable  v-model="queryParams.standardStatus"
                      :options="dict.type.standard_status">
            </t-select>
          </t-form-item>
         <!-- <t-form-item label="审批状态" name="approveStatus">-->
<!--            <t-select style="width: 240px" clearable  v-model="queryParams.approveStatus"-->
<!--                      :options="dict.type.approve_status">-->
<!--            </t-select>-->
<!--          </t-form-item> -->
        </t-col>
        <t-col :span="1" class="operation-container">
          <t-button theme="primary" type="submit"> 查询</t-button>
          <t-button theme="default" variant="outline" type="reset">重置</t-button>
        </t-col>
      </t-row>
    </t-form>
    <div class="btn-group-inline">
      <t-button @click="exportExcel" variant="outline" theme="primary">
        <t-icon name="download" slot="icon"/>
        导出
      </t-button>
    </div>
    <t-tabs v-if="isShowTabs" @change="(val)=>{queryParams.queryType=val;getList();}" v-model="queryParams.queryType" :defaultValue="queryParams.queryType" style="margin-bottom: 10px">
      <t-tab-panel :key="item.id" :value="item.id" v-for="(item) in [{'name': '全部',id: null},...queryTypeOptions]" :label="item.name" :destroyOnHide="false">
      </t-tab-panel>
    </t-tabs>
    <t-table rowKey="index" size="small" :data="data" :columns="queryParams.queryType === 2 ? columns1 : queryParams.queryType === 3 ? columns2 : columns" hover :pagination="pagination"
             :loading="dataLoading" :sort="sort" :hideSortTips="true" @sort-change="sortChange">
      <template #projectName="{ row }">
        <t-link @click="handleOpenDetail(row)" hover="color" theme="primary">{{ row.projectName }}</t-link>
      </template>
      <template #standardProperty="{ row }">
        {{ row.standardProperty | filterByDict(dict.type.standard_property) }}
      </template>

      <template #formulateType="{ row }">
        {{ row.formulateType | filterByDict(dict.type.formulate_type) }} <span v-if="row.formulateType!=='1'">({{ row.reviseNum }})</span>
      </template>

      <template #draftUnitNames="{ row }">
        <t-tooltip :content="row.draftUnitNames">
          <p style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden;">
            {{row.draftUnitNames || "-"}}
          </p>
        </t-tooltip>
      </template>

      <template #standardStatus="{ row }">
        <t-tag v-if="doFilter(row.standardStatus, dict.type.standard_status).length <= 10" @click="dialog.header=row.projectName;dialog.standardCategory=row.standardCategory;dialog.objId=row.id;dialog.open_approve_list=true" class="cursor-pointer" :theme="handleTheme(row.standardStatus, dict.type.standard_status)" variant="light">
          {{ row.standardStatus | filterByDict(dict.type.standard_status) }}
        </t-tag>
        <t-tooltip v-else :content="doFilter(row.standardStatus, dict.type.standard_status)">
          <t-tag @click="dialog.header=row.projectName;dialog.standardCategory=row.standardCategory;dialog.objId=row.id;dialog.open_approve_list=true" class="cursor-pointer" :theme="handleTheme(row.standardStatus, dict.type.standard_status)" variant="light">
          {{ row.standardStatus | filterByDict(dict.type.standard_status) }}
          </t-tag>
        </t-tooltip>
      </template>

      <template #projectUp="{ row }">
        {{ row.projectUp === '1'?'是':'否' }}
      </template>
      <template #patentUp="{ row }">
        {{ row.patentUp === '1'?'是':'否' }}
      </template>
<!--      <template #approveStatus="{ row }">-->
<!--        <t-tag v-if="row.approveStatus"  @click="dialog.header=row.projectName;dialog.standardCategory=row.standardCategory;dialog.objId=row.id;dialog.open_approve_list=true" class="cursor-pointer" :theme="handleTheme(row.approveStatus, dict.type.approve_status)" variant="light">-->
<!--          {{ row.approveStatus | filterByDict(dict.type.approve_status) }}-->
<!--        </t-tag>-->
<!--        <t-tag @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_approve_list=true"-->
<!--               class="cursor-pointer" v-else theme="warning" variant="light">未提交-->
<!--        </t-tag>-->
<!--      </template>-->
      <template #op="{ row }">
       <!-- <t-button  v-if="row.isOldProject === '1' && ($store.state.user.roles.includes('admin') || $store.state.user.roles.includes('dwgly'))" @click="update(row)" size="small"
                  variant="text" class="t-button-link">
         <t-icon name="edit-1" slot="icon"/>
         编辑
       </t-button> -->
       <t-button  v-if="row.isOldProject === '1'" @click="update(row)" size="small"
                  variant="text" class="t-button-link">
         <t-icon name="edit-1" slot="icon"/>
         编辑
       </t-button>
        <t-button size="small" @click="handleOpenDetail(row)" variant="text" class="t-button-link">
          <t-icon name="info-circle" slot="icon"/>
          详情
        </t-button>
      </template>
    </t-table>
    <standardDetailDialog  :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_standard_detail" v-if="dialog.open_standard_detail">
    </standardDetailDialog>
    <approveList :header="dialog.header" :standardCategory="dialog.standardCategory" :obj-id="dialog.objId" :visible.sync="dialog.open_approve_list" v-if="dialog.open_approve_list"></approveList>
    <standardDetailDialogOld  :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_standard_detail_old" v-if="dialog.open_standard_detail_old"></standardDetailDialogOld>
  </div>
</template>

<script>
import standardDetailDialog from "@/pages/bzh/standard/components/standard-detail-dialog.vue";
import standardDetailDialogOld from "@/pages/bzh/standard/components/standard-detail-dialog-old.vue";
import approveList from "@/pages/bzh/approve/components/approve-list.vue";
import filters from "@/filters/index"

export default {
  name: "apply-my",
  dicts:["formulate_type","approve_status","standard_status", 'standard_property', 'yes_or_not', 'standard_category'],
  components: {
    standardDetailDialog,
    approveList,
    standardDetailDialogOld,
  },
  data() {
    return {
      site_tag: import.meta.env.VITE_SITE_TAG,
      deptMenuOptions:[],
      isShowTabs: false,
      queryTypeOptions: [
        {
          id: 1,
          name: '计划中',
        },
        {
          id: 2,
          name: '报批中',
        },
        {
          id: 3,
          name: '已发布',
        },
        {
          id: 4,
          name: '已宣贯',
        }
      ],
      queryParams:{
        pageNum:1,
        pageSize:10,
        projectName:"",
        formulateType:"",
        firstDraftUnitName: '',
        publicDateRange: [],
        standardProperty: '',
        completeDateString: '',
        startCompleteDate: '',
        draftUnitNames: '',
        endCompleteDate: '',
        patentUp: '',
        projectUp: '',
        standardCategory: '',
        standardStatus: '',
        approveStatus: '',
        systemId: '',
        createTimeString: '',
        publishDateString: '',
        implDateString: '',
        queryType: null,
        standardStatusList: []
      },
      pagination: {
        current: 1,
        pageSize: 10,
        total: 0,
        showPageSize: true,
        pageSizeOptions: [10,20,30],
        showFirstAndLastPageBtn: false,
        onChange: (pageInfo) => {
          Object.assign(this.pagination,pageInfo)
          this.queryParams.pageNum = pageInfo.current || 1;
          this.queryParams.pageSize = pageInfo.pageSize;
          this.getList()
        },
      },
      dialog:{
        objId: null,
        header:"",
        open_detail: false,
        open_approve_list: false,
        standardCategory: false,
        open_standard_detail: false,
        open_standard_detail_old: false,
      },
      sort:[],
      dataLoading: false,
      columns:[
        {
          colKey: "projectName",
          title: "标准名称",
          align: "center",
          width: 220
        },
        // {
        //   colKey: "projectNum",
        //   title: "标准编号",
        //   align: "center",
        //   width: 155
        // },
        {
          colKey: "systemName",
          title: "标准体系",
          align: "center",
          width: 155
        },
        {
          colKey: "standardProperty",
          title: "标准性质",
          align: "center",
          width: 80
        },
        {
          colKey: "formulateType",
          title: "制定/修订",
          align: "center",
          width: 100
        },
        {
          colKey: "manageDeptName",
          title: "主管部门",
          align: "center",
          width: 180,
        },
        {
          colKey: "draftUnitNames",
          title: "起草单位",
          align: "center",
          // width: 180,
        },
        // {
        //   colKey: "completeDate",
        //   title: "计划完成时间",
        //   align: "center",
        //   width: 130,
        //   sorter: true,
        // },
        // {
        //   colKey: "projectUp",
        //   title: "有项目支撑",
        //   align: "center",
        //   width: 100
        // },
        // {
        //   colKey: "patentUp",
        //   title: "有涉及专利",
        //   align: "center",
        //   width: 100
        // },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        //   width: 200
        // },
        {
          colKey: "standardStatus",
          title: "标准状态",
          align: "center",
          width: 160,
          fixed: 'right'
        },
        // {
        //   colKey: "approveStatus",
        //   title: "审批状态",
        //   align: "center",
        //   width: 160,
        //   fixed: 'right'
        // },
        {
          colKey: "op",
          title: "操作",
          align: "center",
          width: 150,
          fixed: 'right'
        },
      ],
      columns2:[
        {
          colKey: "projectName",
          title: "标准名称",
          align: "center",
          width: 220
        },
        {
          colKey: "systemName",
          title: "标准体系",
          align: "center",
          width: 155
        },
        {
          colKey: "standardProperty",
          title: "标准性质",
          align: "center",
          width: 80
        },
        {
          colKey: "formulateType",
          title: "制定/修订",
          align: "center",
          width: 100
        },
        {
          colKey: "manageDeptName",
          title: "主管部门",
          align: "center",
          width: 180,
        },
        {
          colKey: "draftUnitNames",
          title: "起草单位",
          align: "center",
          // width: 180,
        },
        {
          colKey: "publishDate",
          title: "发布时间",
          align: "center",
          width: 130,
          sorter: true,
        },
        {
          colKey: "standardStatus",
          title: "标准状态",
          align: "center",
          width: 160,
          fixed: 'right'
        },
        {
          colKey: "op",
          title: "操作",
          align: "center",
          width: 150,
          fixed: 'right'
        },
      ],
      columns1:[
        {
          colKey: "projectName",
          title: "标准名称",
          align: "center",
          width: 220
        },
        {
          colKey: "systemName",
          title: "标准体系",
          align: "center",
          width: 155
        },
        {
          colKey: "standardProperty",
          title: "标准性质",
          align: "center",
          width: 80
        },
        {
          colKey: "formulateType",
          title: "制定/修订",
          align: "center",
          width: 100
        },
        {
          colKey: "manageDeptName",
          title: "主管部门",
          align: "center",
          width: 180,
        },
        {
          colKey: "draftUnitNames",
          title: "起草单位",
          align: "center",
          // width: 180,
        },
        {
          colKey: "reportDate",
          title: "报批日期",
          align: "center",
          width: 130,
          sorter: true,
        },
        {
          colKey: "completeDate",
          title: "计划完成时间",
          align: "center",
          width: 130,
          sorter: true,
        },
        {
          colKey: "standardStatus",
          title: "标准状态",
          align: "center",
          width: 160,
          fixed: 'right'
        },
        {
          colKey: "op",
          title: "操作",
          align: "center",
          width: 150,
          fixed: 'right'
        },
      ],
      data: []
    }
  },
  created() {
    if (this.$route.query.queryType) {
      this.queryParams.queryType = this.$route.query.queryType
    }
    this.isShowTabs = true
    if (this.$route.query.standardStatusList) {
      this.queryParams.standardStatusList = this.$route.query.standardStatusList;
    }
    if (this.$route.query.standardCategory) {
      this.queryParams.standardCategory = this.$route.query.standardCategory
    }
    if (this.$route.query.systemId) {
      this.queryParams.systemId = this.$route.query.systemId
    }
    if (this.$route.query.deptName) {
      this.queryParams.firstDraftUnitName = this.$route.query.deptName
    }
    if (this.$route.query.createTime) {
      this.queryParams.createTimeString = this.$route.query.createTime
    }
    if (this.$route.query.completeDate) {
      this.queryParams.completeDateString = this.$route.query.completeDate
    }
    if (this.$route.query.publishDate) {
      this.queryParams.publishDateString = this.$route.query.publishDate
    }
    if (this.$route.query.implDate) {
      this.queryParams.implDateString = this.$route.query.implDate
    }
    this.getList()
    this.getDeptTreeSelect()
  },
  methods: {
    doFilter(val, dict) {
      return filters.filterByDict(val, dict)
    },
    exportExcel(){
      this.$download(`/bzh/excel/allProjectList`,this.queryParams, `项目列表_${new Date().getTime()}.xls`)
    },
    // 排序
    sortChange(sort){
      this.sort = sort;
      let orderByColumn = []
      let isAsc = []
      if(sort instanceof Array){
        orderByColumn = sort.map(val=>val.sortBy)
        isAsc = sort.map(val=>val.descending?`desc`:`asc`)
      }else {
        orderByColumn = [sort.sortBy]
        isAsc = [sort.descending?`desc`:`asc`]
      }
      this.queryParams.orderByColumn = orderByColumn.join(",")
      this.queryParams.isAsc = isAsc.join(",")
      this.getList();
    },
    // 获取接口数据
    getList(){
      [this.queryParams.startCompleteDate,this.queryParams.endCompleteDate] = this.queryParams.publicDateRange;
      this.dataLoading = true
      return this.$api.bzh.standard.list(this.queryParams).then(response=>{
        this.pagination.total = response.total
        this.data = response.rows
        this.dataLoading = false
      }).catch(e=>{
        this.dataLoading = false
        this.$message.error(e.toString())
      })
    },
    getDeptTreeSelect(){
      return this.$api.system.dept.treeSelectAllIn().then(response=>{
        this.deptMenuOptions = response.data
      }).catch(e=>{
        this.$message.error(e.toString())
      })
    },
    // 编辑按钮
    update(row){
      this.$router.push({
        path:`/bzh/other/register/register-apply/${row.id}`,
        query: {
          isOldProject: row.isOldProject
        }
      });
    },
    // 详情
    handleOpenDetail(row){
      this.dialog.header =  row.projectName
      this.dialog.objId =  row.id
      if(row.isOldProject === '1') {
        this.dialog.open_standard_detail_old =  true
      }else {
        this.dialog.open_standard_detail =  true
      }
    }
  }
}
</script>

<style lang="less" scoped>

</style>

